<template>
  <div class="bg" v-if = 'showLoading'>
    <div class="load">
      <!-- <div class="sload">
      </div> -->
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      showLoading: false
    }
  }
}
</script>

<style lang="scss" scoped>
@keyframes move{
  0%{
    transform: rotate(0deg);
  }
  100%{
    transform: rotate(360deg);
  }
}

.bg{
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,.5);
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  .load{
    width: 40px;
    height: 40px;
    border: 4px solid rgb(168, 43, 43);;
    border-left-color: transparent;
    border-radius: 50%;
    animation: move 1s infinite linear;
  }
}
</style>
